<ion-header>
  <ion-navbar>
    <ion-title>{{ peripheral.name || 'Device' }}</ion-title>
  </ion-navbar>
</ion-header>

<ion-content class="padding">

  <ion-card>
    <ion-card-header>
      {{ peripheral.name || 'Unnamed' }}
    </ion-card-header>
    <ion-card-content>
      {{ peripheral.id }}
    </ion-card-content>
  </ion-card>

  <ion-card>
    <ion-card-header>
      Services
    </ion-card-header>

    <ion-list>
      <ion-item *ngFor="let service of peripheral.services">
        {{service}}
      </ion-item>
    </ion-list>
  </ion-card>

  <ion-card>
    <ion-card-header>
      Details
    </ion-card-header>
    <ion-card-content>
      <pre>{{peripheral | json }}</pre>
    </ion-card-content>
  </ion-card>
  <ion-item>
    <ion-label>E4</ion-label>
    <ion-toggle [(ngModel)]="autoE4" (ionChange)="onE4SwitchChange($event);"></ion-toggle>
  </ion-item>

  <ion-item>
    <ion-label>Power</ion-label>
    <ion-toggle [(ngModel)]="power" (ionChange)="onPowerSwitchChange($event);"></ion-toggle>
  </ion-item>
  <ion-item>
    <ion-label>startNotification</ion-label>
    <ion-toggle [(ngModel)]="auto" (ionChange)="onAutoConnectSwitchChange($event);"></ion-toggle>
  </ion-item>
  <ion-item>
    <ion-label>write1tochara1911</ion-label>
    <ion-toggle [(ngModel)]="startNotification" (ionChange)="onWriteNotificationCommand($event);"></ion-toggle>
  </ion-item>
</ion-content>

<ion-footer>
  <ion-toolbar>
    <p>{{ statusMessage }}</p>
  </ion-toolbar>
</ion-footer>
